<!-- 调压设施台账 -->
<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item label="调压设施编号" prop="deviceCode">
        <el-input
          v-model="queryParams.deviceCode"
          placeholder="请输入调压设施编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="类型" prop="deviceType">
        <el-select
          v-model="queryParams.deviceType"
          placeholder="请选择类型"
          clearable
        >
          <el-option
            v-for="dict in dict.type.bus_device_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="型号" prop="deviceModel">
        <el-input
          v-model="queryParams.deviceModel"
          placeholder="请输入型号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <el-form-item label="所在班组" prop="teamId">
        <el-select
          v-model="queryParams.teamId"
          placeholder="请选择所在班组"
          clearable
        >
          <el-option
            v-for="dict in dict.type.bus_person_group"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="负责人员" prop="personId">
        <el-select
          v-model="queryParams.personId"
          placeholder="请选择负责人员ID"
          clearable
        >
          <el-option
            v-for="dict in dict.type.bus_person_name"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="运行日期" prop="runDate">
        <el-date-picker
          clearable
          v-model="queryParams.runDate"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择运行日期"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="安全阀检定时间" prop="lastSafetyValveCheckDate">
        <el-date-picker
          clearable
          v-model="queryParams.lastSafetyValveCheckDate"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择安全阀检定时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="压力表检定时间" prop="lastPressureGageCheckDate">
        <el-date-picker
          clearable
          v-model="queryParams.lastPressureGageCheckDate"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择压力表检定时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['business:pressure:add']"
          >新增</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['business:pressure:edit']"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['business:pressure:remove']"
          >删除</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['business:pressure:export']"
          >导出</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
        :columns="columns"
      ></right-toolbar>
    </el-row>
    <!-- 表格 -->
    <el-table
      v-loading="loading"
      :data="pressureList"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column
        label="序号"
        type="index"
        width="100"
        align="center"
        v-if="getColumn('index')"
      >
        <template slot-scope="scope">
          <span>{{
            (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
          }}</span>
        </template>
      </el-table-column>
      <!-- <el-table-column label="主键" align="center" prop="id" v-if="getColumn('id')" /> -->
      <el-table-column
        label="调压设施编号"
        align="center"
        prop="deviceCode"
        v-if="getColumn('deviceCode')"
      />
      <el-table-column
        label="类型"
        align="center"
        prop="deviceType"
        v-if="getColumn('deviceType')"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.bus_device_type"
            :value="scope.row.deviceType"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="型号"
        align="center"
        prop="deviceModel"
        v-if="getColumn('deviceModel')"
      />
      <el-table-column
        label="运行日期"
        align="center"
        prop="runDate"
        width="180"
        v-if="getColumn('runDate')"
      >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.runDate, "{y}-{m}-{d}") }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="进口压力范围"
        align="center"
        prop="inPressureRange"
        v-if="getColumn('inPressureRange')"
      />
      <el-table-column
        label="出口压力"
        align="center"
        prop="outPressure"
        v-if="getColumn('outPressure')"
      />
      <el-table-column
        label="所属街道"
        align="center"
        prop="streetId"
        v-if="getColumn('streetId')"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.bus_neighborhoodledger"
            :value="scope.row.streetId"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="所属小区"
        align="center"
        prop="neighborhoodId"
        v-if="getColumn('neighborhoodId')"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.bus_neighborhood"
            :value="scope.row.neighborhoodId"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="所在班组"
        align="center"
        prop="teamId"
        v-if="getColumn('teamId')"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.bus_person_group"
            :value="scope.row.teamId"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="负责人员"
        align="center"
        prop="personId"
        v-if="getColumn('personId')"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.bus_person_name"
            :value="scope.row.personId"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
        v-if="getColumn('operate')"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['business:pressure:edit']"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['business:pressure:remove']"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :pageSizes="pageSizes"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改调压设施台账对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="调压设施编号" prop="deviceCode">
              <el-input
                v-model="form.deviceCode"
                placeholder="请输入调压设施编号"
              />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="类型" prop="deviceType">
              <el-select v-model="form.deviceType" placeholder="请选择类型">
                <el-option
                  v-for="dict in dict.type.bus_device_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="型号" prop="deviceModel">
              <el-input v-model="form.deviceModel" placeholder="请输入型号" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="运行日期" prop="runDate">
              <el-date-picker
                v-model="form.runDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="请选择运行日期"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="出口压力" prop="outPressure">
              <el-input
                v-model="form.outPressure"
                placeholder="请输入出口压力"
              />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="进口管径" prop="inPipe">
              <el-input v-model="form.inPipe" placeholder="请输入进口管径" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12"> </el-col>

          <el-col :span="12"> </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="出口管径" prop="outPipe">
              <el-input
                v-model="form.outPipe"
                placeholder="请输入出口管径"
              /> </el-form-item
          ></el-col>

          <el-col :span="12">
            <el-form-item label="外壳运行时间" prop="shellRunTime">
              <el-date-picker
                clearable
                v-model="form.shellRunTime"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="请选择外壳运行时间"
              >
              </el-date-picker> </el-form-item
          ></el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="影响范围" prop="reach">
              <el-input
                v-model="form.reach"
                placeholder="请输入影响范围"
              /> </el-form-item
          ></el-col>

          <el-col :span="12">
            <el-form-item label="泄露报警" prop="leakageAlarm">
              <el-input
                v-model="form.leakageAlarm"
                placeholder="请输入泄露报警"
              /> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="设计流量" prop="designFlow">
              <el-input
                v-model="form.designFlow"
                placeholder="请输入设计流量"
              />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="低压是否联网" prop="lowPressureOnline">
              <el-radio-group v-model="form.lowPressureOnline">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否有放散阀" prop="hasReleaseValve">
              <el-radio-group v-model="form.hasReleaseValve">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >

          <el-col :span="12">
            <el-form-item label="所属街道" prop="streetId">
              <el-select v-model="form.streetId" placeholder="请选择所属街道ID">
                <el-option
                  v-for="dict in dict.type.bus_neighborhoodledger"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="所属小区" prop="neighborhoodId">
              <el-select
                v-model="form.neighborhoodId"
                placeholder="请选择所属小区ID"
              >
                <el-option
                  v-for="dict in dict.type.bus_neighborhood"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="详细地址" prop="address">
              <el-input
                v-model="form.address"
                placeholder="请输入详细地址"
              /> </el-form-item
          ></el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="纬度" prop="lat">
              <el-input v-model="form.lat" placeholder="请输入纬度" />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="经度" prop="lon">
              <el-input v-model="form.lon" placeholder="请输入经度" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="所在班组" prop="teamId">
              <el-select v-model="form.teamId" placeholder="请选择所在班组"
              @change="getStaffList"
              >
                <el-option
                  v-for="dict in dict.type.bus_person_group"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select> </el-form-item
          ></el-col>

          <el-col :span="12">
            <el-form-item label="负责人员" prop="personId">
              <el-select v-model="form.personId" placeholder="请选择负责人员">
                <el-option
                  v-for="item in staffList"
                  :key="item.id"
                  :label="item.personName"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="内部照片" prop="imageOne">
          <image-upload v-model="form.imageOne" />
        </el-form-item>
        <el-form-item label="外部照片" prop="imageTwo">
          <image-upload v-model="form.imageTwo" />
        </el-form-item>
        <el-form-item label="工艺流程图" prop="imageThree">
          <image-upload v-model="form.imageThree" />
        </el-form-item>
        <el-form-item label="压缩包地址" prop="zipPath">
          <el-input
            v-model="form.zipPath"
            type="textarea"
            placeholder="请输入内容"
          />
        </el-form-item>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="设备长度" prop="deviceLength">
              <el-input
                v-model="form.deviceLength"
                placeholder="请输入设备长度"
              /> </el-form-item
          ></el-col>

          <el-col :span="12">
            <el-form-item label="设备宽度" prop="deviceWidth">
              <el-input
                v-model="form.deviceWidth"
                placeholder="请输入设备宽度"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="设备高度" prop="deviceHeight">
              <el-input
                v-model="form.deviceHeight"
                placeholder="请输入设备高度"
              /> </el-form-item
          ></el-col>

          <el-col :span="12">
            <el-form-item label="备注" prop="deviceDesc">
              <el-input
                v-model="form.deviceDesc"
                type="textarea"
                placeholder="请输入内容"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="使用类型" prop="useType">
              <el-radio-group v-model="form.useType">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="运行状态" prop="deviceStatus">
              <el-radio-group v-model="form.deviceStatus">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="框体是否完整" prop="isFrameIntegrity">
              <el-radio-group v-model="form.isFrameIntegrity">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >

          <el-col :span="12">
            <el-form-item
              label="柜体铭牌是否清晰完好"
              prop="isNameplateIntegrity"
            >
              <el-radio-group v-model="form.isNameplateIntegrity">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否有防撞护栏" prop="isBarrier">
              <el-radio-group v-model="form.isBarrier">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item
              label="报修、防火、禁止吸烟等警示标识是否清晰完好"
              prop="isMarkIntegrity"
            >
              <el-radio-group v-model="form.isMarkIntegrity">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否有截门开关标识" prop="isShutterMark">
              <el-radio-group v-model="form.isShutterMark">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="是否有流向标" prop="isFlowMark">
              <el-radio-group v-model="form.isFlowMark">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否有泄爆口" prop="isExplosionVent">
              <el-radio-group v-model="form.isExplosionVent">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :span="12"
            ><el-form-item
              label="是否有防雷接地、防静电装置"
              prop="isElectricProtection"
            >
              <el-radio-group v-model="form.isElectricProtection">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12"> </el-col>

          <el-col :span="12"> </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否配备灭火器" prop="isFireExtinguisher">
              <el-radio-group v-model="form.isFireExtinguisher">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="预留口是否加堵" prop="isReserveBlocked">
              <el-radio-group v-model="form.isReserveBlocked">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item
              label="调压设施周边是否存在占压、堆积杂物等"
              prop="isOccupy"
            >
              <el-radio-group v-model="form.isOccupy">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >

          <el-col :span="12">
            <el-form-item
              label="调压设施是否有定期保养记录"
              prop="isRegularMaintenance"
            >
              <el-radio-group v-model="form.isRegularMaintenance">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否有报警探头" prop="isAlarmProbe">
              <el-radio-group v-model="form.isAlarmProbe">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >

          <el-col :span="12">
            <el-form-item
              label="静电跨接是否完整"
              prop="isStaticBridgingIntegrity"
            >
              <el-radio-group v-model="form.isStaticBridgingIntegrity">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item
              label="放散管高度是否合规"
              prop="isPipeHeightCompliant"
            >
              <el-radio-group v-model="form.isPipeHeightCompliant">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >

          <el-col :span="12">
            <el-form-item label="安全阀是否超期未检" prop="isSafetyValveExpire">
              <el-radio-group v-model="form.isSafetyValveExpire">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item
              label="上一次安全阀检定时间"
              prop="lastSafetyValveCheckDate"
            >
              <el-date-picker
                clearable
                v-model="form.lastSafetyValveCheckDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="请选择上一次安全阀检定时间"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item
              label="上一次压力表检定时间"
              prop="lastPressureGageCheckDate"
            >
              <el-date-picker
                clearable
                v-model="form.lastPressureGageCheckDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="请选择上一次压力表检定时间"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否有进口缸" prop="isInJar">
              <el-radio-group v-model="form.isInJar">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="是否有进口闸" prop="isInFloodgate">
              <el-radio-group v-model="form.isInFloodgate">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item></el-col
          >
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="是否有出口缸" prop="isOutJar">
              <el-radio-group v-model="form.isOutJar">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="是否有出口闸" prop="isOutFloodgate">
              <el-radio-group v-model="form.isOutFloodgate">
                <el-radio
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-divider content-position="center">调压设施工艺信息信息</el-divider>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
              type="primary"
              icon="el-icon-plus"
              size="mini"
              @click="handleAddBusDevicePressureItem"
              >添加</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="danger"
              icon="el-icon-delete"
              size="mini"
              @click="handleDeleteBusDevicePressureItem"
              >删除</el-button
            >
          </el-col>
        </el-row>
        <!-- 调压设施工艺信息信息 -->
        <el-table
          :data="busDevicePressureItemList"
          :row-class-name="rowBusDevicePressureItemIndex"
          @selection-change="handleBusDevicePressureItemSelectionChange"
          ref="busDevicePressureItem"
        >
          <el-table-column type="selection" width="50" align="center" />
          <el-table-column
            label="序号"
            align="center"
            prop="index"
            width="50"
          />
          <!-- <el-table-column label="调压设备ID" prop="deivceId" width="150">
            <template slot-scope="scope">
              <el-input v-model="scope.row.deivceId" placeholder="请输入调压设备ID" />
            </template>
          </el-table-column> -->
          <el-table-column
            label="调压器型号"
            prop="voltageRegulatorModel"
            width="150"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.voltageRegulatorModel"
                placeholder="请输入调压器型号"
              />
            </template>
          </el-table-column>
          <el-table-column
            label="调压器运行时间"
            prop="voltageRegulatorRunTime"
            width="240"
          >
            <template slot-scope="scope">
              <el-date-picker
                clearable
                v-model="scope.row.voltageRegulatorRunTime"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="请选择调压器运行时间"
              />
            </template>
          </el-table-column>

          <el-table-column
            label="是否有切断阀"
            prop="isHasShutOffValve"
            width="150"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.isHasShutOffValve"
                placeholder="请选择是否有切断阀"
              >
                <el-option
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>

          <el-table-column label="厂家" prop="factory" width="150">
            <template slot-scope="scope">
              <el-input v-model="scope.row.factory" placeholder="请输入厂家" />
            </template>
          </el-table-column>
          <el-table-column label="过滤器型号" prop="filterModel" width="150">
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.filterModel"
                placeholder="请输入过滤器型号"
              />
            </template>
          </el-table-column>
          <el-table-column
            label="过滤器运行时间"
            prop="filterRegulatorRunTime"
            width="240"
          >
            <template slot-scope="scope">
              <el-date-picker
                clearable
                v-model="scope.row.filterRegulatorRunTime"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="请选择过滤器运行时间"
              />
            </template>
          </el-table-column>
          <el-table-column label="过滤器尺寸" prop="filterSize" width="150">
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.filterSize"
                placeholder="请输入过滤器尺寸"
              />
            </template>
          </el-table-column>
          <el-table-column label="是否特种设备" prop="isSpecial" width="150">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.isSpecial"
                placeholder="请选择是否特种设备"
              >
                <el-option
                  v-for="dict in dict.type.bus_yes_no"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <!-- <el-table-column label="排序" prop="sort" width="150">
            <template slot-scope="scope">
              <el-input v-model="scope.row.sort" placeholder="请输入排序" />
            </template>
          </el-table-column> -->
        </el-table>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listPressure,
  getPressure,
  delPressure,
  addPressure,
  updatePressure,
} from "@/api/business/pressure";

import { getTeamPerson } from "@/api/business/person";

export default {
  name: "Pressure",
  dicts: [
    "bus_person_name",
    "bus_device_type",
    "bus_yes_no",
    "bus_neighborhoodledger",
    "bus_person_group",
    "bus_neighborhood",
  ],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 选中的数据的小区的类型
      nhid: [],
      // 子表选中数据
      checkedBusDevicePressureItem: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 调压设施台账表格数据
      pressureList: [],
      // 调压设施工艺信息表格数据
      busDevicePressureItemList: [],
      // 调压设施工艺信息的新增表格数据
      // busDevicePressureItemAddList: [],
      // 对应班组的所有员工
      staffList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        deviceCode: null,
        deviceType: null,
        deviceModel: null,
        runDate: null,
        teamId: null,
        personId: null,
        lastSafetyValveCheckDate: null,
        lastPressureGageCheckDate: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
      // 列信息
      columns: [
        { key: "index", label: `序号`, visible: true },
        { key: "id", label: "主键", visible: true },
        { key: "deviceCode", label: "调压设施编号", visible: true },
        { key: "deviceType", label: "类型", visible: true },
        { key: "deviceModel", label: "型号", visible: true },
        { key: "runDate", label: "运行日期", visible: true },
        { key: "inPressureRange", label: "进口压力范围（mpa）", visible: true },
        { key: "outPressure", label: "出口压力（kpa）", visible: true },
        { key: "streetId", label: "所属街道", visible: true },
        { key: "neighborhoodId", label: "所属小区", visible: true },
        { key: "teamId", label: "所在班组", visible: true },
        // { key: "personId", label: "负责人员", visible: true },
        { key: "operate", label: `操作`, visible: true },
      ],
      // 分页参数
      pageSizes: [10, 50, 100, 500, 1000],
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询调压设施台账列表 */
    getList() {
      this.loading = true;
      listPressure(this.queryParams).then((response) => {
        this.pressureList = response.rows;
        console.log("pressureList:", this.pressureList);
        this.total = response.total;
        this.nhid = [];
        this.loading = false;
      });
    },
    // 获取对应班组的员工
    getStaffList() {
      let teamId = this.form.teamId;
      console.log("teamId:", teamId);
      getTeamPerson(teamId).then((response) => {
        // console.log("response:", response);
        this.staffList = response.data;
        console.log("staffList:", this.staffList);
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        delFlag: null,
        createUser: null,
        createBy: null,
        createTime: null,
        updateUser: null,
        updateBy: null,
        updateTime: null,
        deviceCode: null,
        deviceType: null,
        deviceModel: null,
        runDate: null,
        inPressureRange: null,
        outPressure: null,
        inPressureRemote: null,
        outPressureRemote: null,
        inPipe: null,
        outPipe: null,
        shellRunTime: null,
        reach: null,
        leakageAlarm: null,
        designFlow: null,
        lowPressureOnline: null,
        hasReleaseValve: null,
        streetId: null,
        neighborhoodId: null,
        address: null,
        lat: null,
        lon: null,
        teamId: null,
        personId: null,
        imageOne: null,
        imageTwo: null,
        imageThree: null,
        zipPath: null,
        deviceLength: null,
        deviceWidth: null,
        deviceHeight: null,
        deviceDesc: null,
        useType: null,
        deviceStatus: null,
        isFrameIntegrity: null,
        isNameplateIntegrity: null,
        isBarrier: null,
        isMarkIntegrity: null,
        isShutterMark: null,
        isFlowMark: null,
        isExplosionVent: null,
        isElectricProtection: null,
        isFireExtinguisher: null,
        isReserveBlocked: null,
        isOccupy: null,
        isRegularMaintenance: null,
        isAlarmProbe: null,
        isStaticBridgingIntegrity: null,
        isPipeHeightCompliant: null,
        isSafetyValveExpire: null,
        lastSafetyValveCheckDate: null,
        lastPressureGageCheckDate: null,
        isInJar: null,
        isInFloodgate: null,
        isOutJar: null,
        isOutFloodgate: null,
      };
      this.busDevicePressureItemList = [];
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      // 判断 当前id的小区id是否 与上一个相同 添加不同的小区id
      // 使用 map 函数将 selection 转换为包含所有 neighborhoodId 的数组
      const neighborhoodIds = selection.map((item) => item.neighborhoodId);
      // 遍历这些 ID 并只添加那些尚未存在于 nhid 数组中的 ID
      neighborhoodIds.forEach((id) => {
        if (!this.nhid.includes(id)) {
          // 检查 id 是否已存在
          this.nhid.push(id); // 如果不存在，则添加到 nhid 数组
        }
      });

      console.log("ids:", this.ids);
      console.log("nhid:", this.nhid);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加调压设施台账";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids;
      //  点击修改按钮后， 查询子表数据
      getPressure(id).then((response) => {
        this.form = response.data;
        // console.log("response.data:",response.data);
        this.busDevicePressureItemList =
          response.data.busDevicePressureItemList;
        // console.log("form:",this.form);
        // console.log("busDevicePressureItemList:",this.busDevicePressureItemList);
        this.open = true;
        this.title = "修改调压设施台账";
        this.getStaffList();
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          this.form.busDevicePressureItemList = this.busDevicePressureItemList;

          console.log("新增调压设施台账", this.form);
          // console.log("新增调压设施台账-工艺信息",this.form.busDevicePressureItemList);
          console.log("form:", this.form);
          if (this.form.id != null) {
            // 如果子表的第一个对象的id 为"",则添加子表的选项
            // if (this.form.busDevicePressureItemAddList[0].id = "" ) {

            // }
            updatePressure(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addPressure(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      let nhids = this.nhid;
      // console.log("nhids:",nhids);
      const ids = row.id || this.ids;

      console.log("row id:", row.id);
      console.log("this.ids:", this.ids);
      // 判断是否是单个删除
      // 不是单删除
      if (row.id == null && ids.length > 1) {
        this.$modal
          .confirm("是否确认删除选中的数据项？")
          .then(function () {
            return delPressure(ids, nhids);
          })
          .then(() => {
            this.nhid = [];
            this.getList();
            this.$modal.msgSuccess("删除成功");
          })
          .catch(() => {});
      }
      //  是单删除
      if (row.id != null || ids.length == 1) {
        nhids = [];
        this.$modal
          .confirm("是否确认删除选中的数据项？")
          .then(function () {
            return delPressure(ids, nhids);
          })
          .then(() => {
            this.nhid = [];
            this.getList();
            this.$modal.msgSuccess("删除成功");
          })
          .catch(() => {});
      }
    },
    /** 调压设施工艺信息序号 */
    rowBusDevicePressureItemIndex({ row, rowIndex }) {
      row.index = rowIndex + 1;
    },
    /** 调压设施工艺信息添加按钮操作 */
    handleAddBusDevicePressureItem() {
      let obj = {};
      // obj.id = "";
      obj.deivceId = "";
      obj.voltageRegulatorModel = "";
      obj.voltageRegulatorRunTime = "";
      obj.isHasShutOffValve = "";
      obj.factory = "";
      obj.filterModel = "";
      obj.filterRegulatorRunTime = "";
      obj.filterSize = "";
      obj.isSpecial = "";
      obj.sort = "";
      // this.busDevicePressureItemAddList.push(obj);
      this.busDevicePressureItemList.push(obj);
    },
    /** 调压设施工艺信息删除按钮操作 */
    handleDeleteBusDevicePressureItem() {
      if (this.checkedBusDevicePressureItem.length == 0) {
        this.$modal.msgError("请先选择要删除的调压设施工艺信息数据");
      } else {
        const busDevicePressureItemList = this.busDevicePressureItemList;
        const checkedBusDevicePressureItem = this.checkedBusDevicePressureItem;
        this.busDevicePressureItemList = busDevicePressureItemList.filter(
          function (item) {
            return checkedBusDevicePressureItem.indexOf(item.index) == -1;
          }
        );
      }
    },
    /** 复选框选中数据 */
    handleBusDevicePressureItemSelectionChange(selection) {
      this.checkedBusDevicePressureItem = selection.map((item) => item.index);
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "business/pressure/export",
        {
          ...this.queryParams,
        },
        `pressure_${new Date().getTime()}.xlsx`
      );
    },
    /** 列是否显示 */
    getColumn(key) {
      const res = this.columns.filter((item) => item.key === key);
      if (res.length >= 1) {
        return res[0].visible;
      } else {
        return false;
      }
    },
  },
};
</script>
